<template>
	<div class="register">
		<Logo></Logo>
		<CheckPhone ref="checkPhone" :display="step_1" :callback="checkPhone"></CheckPhone>
		<CheckCode  ref="checkCode" :display="step_2" :prev="toCheckPhone" btnText="找回密码" sendurl="/auth/password/phone/code" :callback="checkCode"></CheckCode>
		<Password ref="password" :display="step_3" btnText="找回密码" :callback="register" ></Password>
	</div>
</template>
<script>


	import Logo from 'touch/components/logo';

	import CheckPhone from 'touch/components/auth/checkphone';
	import CheckCode from 'touch/components/auth/checkcode';
	import Password from 'touch/components/auth/password';

	export default {
		components:{
			Logo,
			CheckPhone,
			CheckCode,
			Password,
        },
        data (){
	        return{
	            step_1 : false,
	            step_2 : false,
	            step_3 : false,
	        }
	    },
	    methods: {
	    	//发送手机验证码组件返回上一步
			toCheckPhone(){
	    		this.step_1 = true;
	    		this.step_2 = false;
	    	},
	    	//验证手机号
			checkPhone(form){
				this.Axios.Auth.Password.PhoneCheck(form)
	            .then(res =>{
                	if(!res) return false;
                	this.step_1 = false;
                	this.step_2 = true;
                	this.$refs.checkCode.form.phone = this.$refs.checkPhone.form.phone;
                	this.$refs.checkCode.form.phonekey = res.data.phonekey;
	            })
			},
			//验证手机验证码
			checkCode(form){
				this.Axios.Auth.Password.CodeCheck(form)
	            .then(res =>{
                	if(!res) return false;
                	this.$refs.password.form.phone = form.phone;
                	this.$refs.password.form.phonekey = form.phonekey;
                	this.$refs.password.form.code = form.code;
                	this.step_2 = false;
                	this.step_3 = true;
                })
			},
			//注册
			register(form){
				this.Axios.Auth.Password.Do(form)
	            .then(res =>{
                	if(!res) return false;
                	window.location.href="/auth/";
	            })
			},
	    },
	    mounted:function(){
	    	this.step_1 = true;
	    }
	}
</script>
<style>
	
</style>